<template>
  <div id="app">
    <Tabbar v-show="isTabbarShow"></Tabbar>
  <transition name="app" mode="out-in">
      <router-view></router-view>
    </transition>
  </div>
</template>

<script>
import Tabbar from "./components/Tabbar";
import {mapState} from "vuex"

export default {
 computed:{
    ...mapState("tabbar",["isTabbarShow"])
  },
  components:{
    Tabbar
  }
};
</script>

<style lang="scss" >
html,body,#app{height: 100%;width: 100%;}
.app-enter-active{
  animation:move .5s;
}
.app-leave-active{
  animation:move .5s reverse;
}

 @keyframes move{
        0%{
            opacity: 0;
        }
        100%{
            opacity: 1;

        }
    }

</style>
